<template>
	<view>
		<tm-picker
			:mapKey="'name'"
			:defaultValue="pickydata"
			@confirm="onConfirm"
			@close="onCancel"
			:show="showPop"
			:columns="columns"
			v-model="pickydata"
			v-model:model-str="dateStr"
			:beforeChange="onChange"
			color="#2DB295"
		>
		</tm-picker>
	</view>
</template>

<script lang="ts" setup>
import { ref, defineEmits } from 'vue';
import { area } from '@/utils/api'

const props = defineProps({
	showPop: {
		type: Boolean,
		default: false
	},
	maxLevel: {
		type: Number,
		default: 3
	}
})

const dateStr = ref()
const columns = ref([])
const data = ref({})
const pickydata = ref([0, 0, 0])

// 获取省市区
const provinceList = async () => {
	const res = await area();
	let data = res.data;
	columns.value = data;
	
	// 根据maxLevel决定初始化时加载多少级数据
	if (props.maxLevel >= 2) {
		// 预加载第一个省份的市级数据
		let obj1 = {
			province: columns.value[0].id
		}
		const res1 = await area(obj1);
		let data1 = res1.data;
		columns.value[0].children = data1
		
		// 如果maxLevel >= 3，预加载第一个城市的区级数据
		if (props.maxLevel >= 3 && data1.length > 0) {
			let obj2 = {
				province: columns.value[0].id,
				city: data1[0].id,
			}
			const res2 = await area(obj2);
			let data2 = res2.data;
			columns.value[0].children[0].children = data2
		}
	}
	
	console.log(columns.value, 'columns')
}
provinceList()

// 取消弹窗
const onCancel = async () => {
	emit('cancel')
}

// 改变
const one_index = ref(0)
const two_index = ref(0)
const onChange = async (e, b, c) => {
	console.log(e, b, c, 'eee222');
	data.value = e
	if (e.to.levelIndex == 0) {
		pickydata.value[0] = e.to.itemindex
		pickydata.value[1] = 0
		pickydata.value[2] = 0
		
		// 如果maxLevel >= 2，加载市级数据
		if (props.maxLevel >= 2) {
			let obj = {
				province: e.to.data.id
			}
			const res = await area(obj);
			let data = res.data;
			columns.value[e.to.itemindex].children = data
			
			// 如果maxLevel >= 3，加载区级数据
			if (props.maxLevel >= 3 && data.length > 0) {
				let obj1 = {
					province: e.to.data.id,
					city: data[0].id,
				}
				const res1 = await area(obj1);
				columns.value[e.to.itemindex].children[0].children = res1.data
			}
		}
		console.log(columns.value)
		one_index.value = e.to.itemindex
		
	} else if (e.to.levelIndex == 1 && props.maxLevel >= 3) {
		two_index.value = e.to.itemindex
		pickydata.value[1] = e.to.itemindex
		pickydata.value[2] = 0
		let obj1 = {
			province: columns.value[one_index.value].id,
			city: e.to.data.id,
		}
		const res1 = await area(obj1);
		let data1 = res1.data;
		columns.value[one_index.value].children[two_index.value].children = data1
		console.log(pickydata.value, 99888)
	}
	return pickydata.value
}

// 确认选择
const emit = defineEmits(['confirm', 'cancel'])
const onConfirm = () => {
	let dateStrx = ''
	let pickydatax = []
	
	try {
		if (props.maxLevel === 1) {
			// 只选择省级
			dateStrx = columns.value[pickydata.value[0]].name
			pickydatax = [columns.value[pickydata.value[0]].id, 0, 0]
		} else if (props.maxLevel === 2) {
			// 选择到市级
			const province = columns.value[pickydata.value[0]]
			const city = province.children && province.children[pickydata.value[1]] ? province.children[pickydata.value[1]] : null
			
			if (city) {
				dateStrx = province.name + '/' + city.name
				pickydatax = [province.id, city.id, 0]
			} else {
				// 如果没有市级数据，只返回省级
				dateStrx = province.name
				pickydatax = [province.id, 0, 0]
			}
		} else {
			// 选择到区级
			const province = columns.value[pickydata.value[0]]
			const city = province.children && province.children[pickydata.value[1]] ? province.children[pickydata.value[1]] : null
			const area = city && city.children && city.children[pickydata.value[2]] ? city.children[pickydata.value[2]] : null
			
			if (area) {
				dateStrx = province.name + '/' + city.name + '/' + area.name
				pickydatax = [province.id, city.id, area.id]
			} else if (city) {
				// 如果没有区级数据，返回到市级
				dateStrx = province.name + '/' + city.name
				pickydatax = [province.id, city.id, 0]
			} else {
				// 如果没有市级数据，只返回省级
				dateStrx = province.name
				pickydatax = [province.id, 0, 0]
			}
		}
		
		console.log('区域地址选择结果:', { 
			dateStrx, 
			pickydatax, 
			maxLevel: props.maxLevel,
			pickydata: pickydata.value
		})
		emit('confirm', dateStrx);
		emit('confirm_shop', dateStrx, pickydatax);
		onCancel();
	} catch (error) {
		console.error('区域地址选择确认错误:', error)
		onCancel();
	}
}
</script>

<style>
	
</style>
